import React from 'react';
import ReactDom from 'react-dom';
import {Button,Menu,Modal,Icon,Tabs,message,Form,Input,CheckBox,Carousel} from 'antd';
import 'antd/dist/antd.css';
const FormItem = Form.Item;
const SubMenu = Menu.SubMenu;
const TabPane = Tabs.TabPane;
const MenuItemGroup = Menu.MenuItemGroup;
import { Row,Col } from 'antd';
import {Router, Route, Link, browserHistory} from 'react-router';


export default class Body extends React.Component{
	constructor(){
		super();
		this.state={
		   Arccontent:'',
		}
	};
	componentWillMount() {
    	var myFetchOptions ={
			method:'GET'
		};
    	var res = fetch("/admin/select?conut=10",myFetchOptions);
        res.then(response => response.json()).then(json=>{
      	if(json.state){
      		this.setState({Arccontent:json.mes});
      	}else{
      		message.error(json.mes);
      	}
      });
    };
    
	render(){
		let {Arccontent} = this.state;
		const arcShow = Arccontent?Arccontent.map((arcItem, index) => (
				<p key={index}>
					<Link to={`detaile/${arcItem._id}`} target="_blank">
						{arcItem.title}
					</Link>
				</p>
			)):"没有推荐文章";
		return (
			<div>
				<Row>
					<Col span={2}></Col>
					<Col span={20} class="content">
						<Carousel autoplay>
						    <div><div class="over"></div><img src="./images/timg.jpg"/></div>
						    <div><div class="over"></div><h3>2</h3></div>
						    <div><div class="over"></div><h3>3</h3></div>
						    <div><div class="over"></div><h3>4</h3></div>
                        </Carousel>
					</Col>
					<Col span={2}></Col>
				</Row>
				<Row>
					<Col span={2}></Col>
					<Col span={20} class="IndexArticle">
						<Col span={16} class="reArticle">
						    <h2>文章推荐</h2>
						    {arcShow}
						</Col>
						<Col span={4} class="sidebar">
						    <h2>侧边栏</h2>
						</Col>
					</Col>
					<Col span={2}></Col>
				</Row>
			</div>
		);
	}
}